<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core">
    <h:head>
        <title>Perfiles y Roles</title>
        <link rel="icon" type="image/ico" href="icon.gif" />
        <link rel="stylesheet" href="resources/css/style.css" />
        <style type="text/css">
            html {
                height: 100%;
            }
            body {
                height: 80%
            }
        </style>        
    </h:head>
    <h:body>
        <h:panelGroup rendered="#{loginBean.loggedIn}">
            Usuario: #{loginBean.user.name} #{loginBean.user.lastname}
            <div id="cuerpo_principal">
                <div id="encabezado">
                    <div id="barra_herramientas">
                    </div>
                    <div id="firma_busqueda">
                        <div id="sector">
                            <img alt="Firma Institucional"
                                 src="resources/img/logo_netbrain.png" />
                        </div>
                    </div>
                </div>
                <div id="cuerpo_interna">
                    <div class="renglon">
                        <div class="cuadro K">
                            <h:form id="formTree">  
                                <p:growl id="messagesFolder" showDetail="true" />
                                <p:tree value="#{treeBean.rootNode}" var="node" id="tree" cache="true"
                                        selection="#{treeBean.selectedNode}" selectionMode="single">

                                    <p:ajax event="select" update=":frmMenu" listener="#{treeBean.onNodeSelect}" />  
                                    <p:treeNode expandedIcon="plus" collapsedIcon="minus">
                                        <h:outputText value="#{node.getName()}" />
                                    </p:treeNode>
                                </p:tree>
                            </h:form>
                        </div>
                        <div class="cuadro B">
                            <!-- Formulario para los menus -->
                            <h:form id="frmMenu" prependId="false">
                                <p:dataTable id="listTree" var="tree" value="#{treeBean.mediumFolderModel}"
                                             rowKey="#{tree.id}" selectionMode="multiple"
                                             selection="#{treeBean.selectedTrees}">
                                    <p:column headerText="Nombre">
                                        #{tree.name}
                                    </p:column>  
                                    <p:column headerText="Descripción">
                                        #{tree.description}
                                    </p:column> 
                                    <p:column headerText="Tamaño KB" >  
                                        #{tree.size}
                                    </p:column>  
                                    <p:column headerText="Fecha de creación">  
                                        #{tree.register}
                                    </p:column>
                                    <p:column headerText="Tipo">  
                                        #{tree.type}
                                    </p:column>                                    
                                    <f:facet name="header">
                                        <p:menubar autoDisplay="false">  
                                            <p:menuitem  
                                                        title="Agregar directorio" icon="folderadd" 
                                                        onclick="dlgNew.show()"/>
                                            <p:menuitem 
                                                        title="Renombrar directorio" icon="folderedit"
                                                        actionListener="#{treeBean.selectedRow}"
                                                        oncomplete="editDialog.show()"
                                                        update=":frmEditFolder:editDialog"/>
                                            <p:menuitem 
                                                        title="Borrra directorio" icon="folderdelete"
                                                        actionListener="#{treeBean.selectedRow}"
                                                        onclick="confirmation.show()"/>
                                            <p:menuitem 
                                                        title="Cargar archivo" icon="pageadd" 
                                                        oncomplete="loadFileDialog.show()"
                                                        update=":frmLoadFile"/>
                                            <p:menuitem 
                                                        title="Renombrar archivo" icon="pageedit" 
                                                        actionListener="#{treeBean.selectedRow}"
                                                        oncomplete="editFileDialog.show()"
                                                        update=":frmEditFile:editFileDialog"/>
                                            <p:menuitem 
                                                        title="Borrra archivo" url="#" icon="pagedelete" />
                                            <p:menuitem 
                                                        title="Buscar archivo" url="#" icon="pagefind" />
                                            <p:menuitem 
                                                        title="Copiar" url="#" icon="copy" />
                                            <p:menuitem 
                                                        title="Pegar" url="#" icon="paste" />
                                            <p:menuitem 
                                                        title="Agregar propiedades" url="#" icon="addproperties" />
                                            <p:menuitem 
                                                        title="Editar propiedades" url="#" icon="editproperties" />
                                            <p:menuitem 
                                                        title="Enviar mail" url="#" icon="sendmail" />
                                            <p:menuitem 
                                                        title="Recibir mail" url="#" icon="mail" />
                                            <p:menuitem value="Salir" url="login.jsf" icon="exit" />
                                        </p:menubar>
                                    </f:facet>
                                </p:dataTable>
                            </h:form>
                            <!-- Formulario para nueva carpeta -->
                            <h:form id="frmNewFolder">
                                <p:dialog header="Nuevo Carpeta" widgetVar="dlgNew" resizable="false" modal="true" 
                                          id="newFolderDialog">  
                                    <p:growl id="newGlow" showDetail="false" sticky="true" />
                                    <h:panelGrid columns="2" style="margin-bottom:10px; width: 250px">  
                                        <h:outputLabel for="name" value="Nombre:" />  
                                        <p:inputText id="name" value="#{treeBean.nameFolder}" />
                                    </h:panelGrid>  
                                    <p:commandButton id="submitButton" value="Guardar" icon="save" 
                                                     actionListener="#{treeBean.newFolder()}" 
                                                     oncomplete="dlgNew.hide();" 
                                                     update=":frmMenu:listTree,newGlow :formTree :frmNewFolder" />
                                    <p:commandButton value="Cancelar" oncomplete="dlgNew.hide();" icon="cancel" />
                                </p:dialog>
                            </h:form>
                            <!-- Formulario para editar nombre de carpeta -->
                            <h:form id="frmEditFolder">
                                <p:dialog header="Editar nombre de la carpeta" widgetVar="editDialog" 
                                          resizable="false" modal="true" id="editDialog">
                                    <h:panelGrid columns="2" style="margin-bottom:10px">  
                                        <h:outputLabel for="name" value="Nombre:" />  
                                        <p:inputText id="name" value="#{treeBean.treeEdit.name}" />
                                    </h:panelGrid>
                                    <p:commandButton value="Guardar" icon="save" oncomplete="editDialog.hide();"
                                                     actionListener="#{treeBean.editFolder()}"
                                                     update=":frmMenu:listTree :formTree"/>
                                    <p:commandButton value="Cancelar" oncomplete="editDialog.hide();" icon="cancel" />
                                </p:dialog>
                            </h:form>
                            <!-- Formulario para borrar carpeta -->
                            <h:form prependId="false">  
                                <p:confirmDialog id="confirmDialog" message="Esta seguro de borrar?"  
                                                 header="Borrar" severity="alert" widgetVar="confirmation">  
                                    <p:commandButton id="confirm" update=":frmMenu:listTree :formTree" value="Si" 
                                                     actionListener="#{treeBean.deleteFolder()}"
                                                     oncomplete="confirmation.hide()"
                                                     icon="accept"/>  
                                    <p:commandButton id="decline" value="No" onclick="confirmation.hide()" 
                                                     type="button" icon="cancel"/>
                                </p:confirmDialog>
                            </h:form>
                            <!-- Formulario para cargar archivos -->
                            <h:form id="frmLoadFile" enctype="multipart/form-data">
                                <p:dialog header="Cargar archivos" widgetVar="loadFileDialog" 
                                          resizable="false" modal="true" id="loadFileDialog">
                                    <h:panelGrid columns="2" style="margin-bottom:10px; width: 400px;">  
                                        <p:fileUpload fileUploadListener="#{treeBean.fileUpload}"  
                                                      mode="advanced"   
                                                      update="loadFileGlow :frmMenu:listTree"  
                                                      sizeLimit="100000"   
                                                      allowTypes="/(\.|\/)(gif|jpe?g|png)$/" />  
                                        <p:growl id="loadFileGlow" showDetail="true"/> 
                                    </h:panelGrid>
                                </p:dialog>
                            </h:form>
                            <!-- Formulario para editar nombre del archivo -->
                            <h:form id="frmEditFile">
                                <p:dialog header="Editar nombre del archivo" widgetVar="editFileDialog" 
                                          resizable="false" modal="true" id="editFileDialog">
                                    <h:panelGrid columns="2" style="margin-bottom:10px">  
                                        <h:outputLabel for="name" value="Nombre:" />  
                                        <p:inputText id="name" value="#{treeBean.treeEdit.name}" />
                                    </h:panelGrid>
                                    <p:commandButton value="Guardar" icon="save" oncomplete="editFileDialog.hide();"
                                                     actionListener="#{treeBean.editFile()}"
                                                     update=":frmMenu:listTree :formTree"/>
                                    <p:commandButton value="Cancelar" oncomplete="editFileDialog.hide();" icon="cancel" />
                                </p:dialog>
                            </h:form>                            
                        </div>
                    </div>
                </div>
                <div id="footer" class="ui-widget ui-widget-header ui-corner-all">
                    <p class="copyright">Datos para el pie de pagina</p>
                </div>
            </div>
        </h:panelGroup>
    </h:body>
</html>